import {
  selectDayConsumeTopThree,
  selectDayIndustryNumber,
  selectMonthConsumeTopThree,
  selectMonthIndustryNumber,
  selectYearConsumeTopThree,
  selectYearIndustryNumber,

  loadDayComprehensiveEnergyConsumptionList,
  loadMonthComprehensiveEnergyConsumptionList,
  loadYearComprehensiveEnergyConsumptionList,

  selectDayComprehensiveEnergyConsumptionTopFive,
  selectMonthComprehensiveEnergyConsumptionTopFive,
  selectYearComprehensiveEnergyConsumptionTopFive,
} from '@/api/energyDataManagement'
import LineOne from '@/components/energy-data-component/line-one'
import LineTwo from '@/components/energy-data-component/line-two'
import BarThree from '@/components/energy-data-component/bar-three'
import PieChart from '@/components/energy-data-component/pie-chart'
import { simpleJson2Sheet } from '@/utils/sheet'
import {
  CHART_DAILY, CHART_MONTHLY, CHART_ANNUAL,
} from '@/utils/constant'
import { COMPREHENSIVE_CONSUMPTION } from '@/config'

export default {
  components: { LineOne, LineTwo, BarThree, PieChart },
  data () {
    const now = new Date()
    const year = now.getFullYear()
    const prevMonth = now.getMonth()
    const date = now.getDate()
    now.setDate(date - 1)
    const prevDate = now.getDate()
    return {
      type: '',
      colors: ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc'],
      pie1: [],
      pie2: [],
      pie3: [],
      pie4: [],
      pie5: [],
      pie6: [],
      prevDate,
      prevMonth,
      year,

      chartType: CHART_DAILY,
      chartTypeOptions: [
        { name: '日度耗用', value: CHART_DAILY },
        { name: '月度耗用', value: CHART_MONTHLY },
        { name: '年累积耗用', value: CHART_ANNUAL },
      ]
    }
  },
  computed: {
    unitName () {
      const energyUnits = this.$store.state.energyUnits
      const type = this.type
      const target = energyUnits.find(v => v.key === type)
      return target ? target.value : '吨标准煤'
    },
    pie () {
      const chartType = this.chartType
      if (chartType === CHART_DAILY) {
        return this.pie1
      }
      if (chartType === CHART_MONTHLY) {
        return this.pie3
      }
      if (chartType === CHART_ANNUAL) {
        return this.pie5
      }
      return []
    },
    pieTitle () {
      const chartType = this.chartType
      const typeText = this.typeText
      const prevMonth = this.prevMonth
      const prevDate = this.prevDate
      const year = this.year
      if (chartType === CHART_DAILY) {
        return `${prevDate}日企业${typeText}排行`
      }
      if (chartType === CHART_MONTHLY) {
        return `${prevMonth}月企业${typeText}排行`
      }
      if (chartType === CHART_ANNUAL) {
        return `${year}年企业${typeText}排行`
      }
      return '企业排行'
    },
    chartComponent () {
      const chartType = this.chartType
      if (chartType === CHART_DAILY) {
        return LineOne
      }
      if (chartType === CHART_MONTHLY) {
        return LineTwo
      }
      if (chartType === CHART_ANNUAL) {
        return BarThree
      }
      return null
    },
    selectYearIndustryNumber () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return loadYearComprehensiveEnergyConsumptionList
      }
      return selectYearIndustryNumber
    },
    selectMonthIndustryNumber () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return loadMonthComprehensiveEnergyConsumptionList
      }
      return selectMonthIndustryNumber
    },
    selectDayIndustryNumber () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return loadDayComprehensiveEnergyConsumptionList
      }
      return selectDayIndustryNumber
    },
    selectYearConsumeTopThree () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return selectYearComprehensiveEnergyConsumptionTopFive
      }
      return selectYearConsumeTopThree
    },
    selectMonthConsumeTopThree () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return selectMonthComprehensiveEnergyConsumptionTopFive
      }
      return selectMonthConsumeTopThree
    },
    selectDayConsumeTopThree () {
      const type = this.type
      if (type === COMPREHENSIVE_CONSUMPTION) {
        return selectDayComprehensiveEnergyConsumptionTopFive
      }
      return selectDayConsumeTopThree
    },
  },
  mounted () {
    this.selectYearList()
    this.selectMonthList()
    this.selectDayList()
    this.selectYearRank()
    this.selectMonthRank()
    this.selectDayRank()
  },
  methods: {
    backToVisual () {
      this.$router.push({
        name: 'VisualEnergyData'
      }).catch(() => {})
    },
    selectYearList () {
      if (this.type) {
        this.selectYearIndustryNumber(this.type).then(res => {
          if (res.code === 200) {
            let data = res.data || []
            // loadYearComprehensiveEnergyConsumptionList 返回的是 Object
            data = Array.isArray(data) ? data : [data]
            this.pie6 = (data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    selectYearRank () {
      if (this.type) {
        this.selectYearConsumeTopThree(this.type).then(res => {
          if (res.code === 200) {
            this.pie5 = (res.data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    selectMonthList () {
      if (this.type) {
        this.selectMonthIndustryNumber(this.type).then(res => {
          if (res.code === 200) {
            this.pie4 = (res.data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    selectMonthRank () {
      if (this.type) {
        this.selectMonthConsumeTopThree(this.type).then(res => {
          if (res.code === 200) {
            this.pie3 = (res.data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    selectDayList () {
      if (this.type) {
        this.selectDayIndustryNumber(this.type).then(res => {
          if (res.code === 200) {
            this.pie2 = (res.data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    selectDayRank () {
      if (this.type) {
        this.selectDayConsumeTopThree(this.type).then(res => {
          if (res.code === 200) {
            this.pie1 = (res.data || []).map(v => ({
              name: v.name,
              value: v.val
            }))
          }
        })
      }
    },
    exportPieData () {
      const pieTitle = this.pieTitle
      const typeText = this.typeText
      const fileName = `${pieTitle}.xlsx`
      const headers = [['企业名称', `${typeText}（${this.unitName}）`]]
      const data = this.pie
      simpleJson2Sheet(fileName, headers, data, pieTitle)
    },
  },
}
